import React, { useEffect, useState } from 'react'
import { List, Image } from 'antd-mobile'
export default function CommingSoon() {
  const [filmInfoList, setFilmInfoList] = useState([])
  useEffect(() => {
    // fetch("/api/mmdb/movie/v3/list/hot.json?ct=%E8%93%9D%E7%94%B0&ci=809&channelId=4",
    // ).then(res => res.json()).then(res => {
    //   console.log(res)
    //   setFilmInfoList(res.data.hot)
    // })
    fetch("https://m.maizuo.com/gateway?cityId=340800&pageNum=1&pageSize=10&type=2&k=9082474", {
      headers: {
        'X-Client-Info': '{"a":"3000","ch":"1002","v":"5.2.1","e":"16722220591298527527370753","bc":"340800"}',
        'X-Host': 'mall.film-ticket.film.list'
      }
    }
    ).then(res => res.json()).then(res => {
      console.log(res.data.films)
      setFilmInfoList(res.data.films)
    })
    return () => { }
  }, [])

  return (
    <div>
      <List>
        {filmInfoList.map(user => (
          <List.Item
            key={user.filmId}
            prefix={
              <Image
                src={user.poster}
                // style={{ borderRadius: 20 }} 圆角
                fit='cover'
                width={40}
                height={40}

              />
            }
            description={user.synopsis.substring(0, 20) + "......"}
          >
            {user.name}
          </List.Item>
        ))}

      </List>
    </div >
  )
}
